import React, { useState } from 'react';
import ProductSalePage from './ProductSalePage';
import PurchaseConfirmationPage from './PurchaseConfirmationPage'
import {
    ProductTransactionSheetAll,
    MaterialTransactionSheetTabs
} from './style';
/**
 * @description: 费用管理 -- 内部交易 --  产品交易单
 * @author: xiaoxujs
 * @updata: xiaoxujs（2021-09-17）创建
 */

const ProductTransactionSheet = () => {
    const [tabsSelect, setTabsSelect] = useState(true); //true 出库 false 领用确认
    return <ProductTransactionSheetAll>
        <MaterialTransactionSheetTabs>
            <div className='tabs_button_box'>
                <button onClick={() => setTabsSelect(true)} className={!tabsSelect ? 'tabs_button_select_no' : 'tabs_button_select'}>产品出售</button>
                <button onClick={() => setTabsSelect(false)} className={!tabsSelect ? 'tabs_button_select' : 'tabs_button_select_no'}>购买确认</button>
            </div>
        </MaterialTransactionSheetTabs>
        {
            tabsSelect
                ?
                <ProductSalePage />
                :
                <PurchaseConfirmationPage />
        }
    </ProductTransactionSheetAll>
}

export default ProductTransactionSheet;